<template>
	<view>

		<view class="im">
			<image class="i_img" src="/static/img/peo2.png"></image>
		</view>
		<view class="i_item">
			<view class="i_item_l">学生名</view>
			<view class="i_item_r">{{info.name}}</view>
		</view>
		<view class="bg_line"></view>
		<view class="i_item">
			<view class="i_item_l">学号</view>
			<view class="i_item_r">{{info.stuNumber}}</view>
		</view>
		<view class="bg_line"></view>
		<view class="i_item">
			<view class="i_item_l">专业</view>
			<view class="i_item_r">{{info.className}}</view>
		</view>
		<view class="bg_line"></view>
		<view class="i_item">
			<view class="i_item_l">邮件</view>
			<view class="i_item_r">{{info.email==null?'':info.email}}</view>
		</view>
		<view class="bg_line"></view>
		<view class="i_item">
			<view class="i_item_l">手机号</view>
			<view class="i_item_r">{{info.telephone==null?'':info.telephone}}</view>
		</view>
		<view class="bg_line"></view>
	</view>
</template>

<script>
	import {
		// getTest,
		getStudentInfo
	} from '@/api/my/service.js';
	export default {
		data() {
			return {
				key: -1,
				info:null
			}
		},
		onLoad(option) {
			this.key = option.key;
			console.log(option);
			this.loadDat(this.key);

		},
		methods: {
			loadDat(index) {
				getStudentInfo(index)
					.then(res => {
						console.log(res);
						this.info = res.data;
						console.log(this.info);
					}).catch(res => {
						console.log(res);
					})
			}
		}
	}
</script>

<style>
	.im{
		width: 100%;
		justify-content: center;
		align-items: center;
		
		display: flex;
	}
	.i_img {
		width:60px ;
		height: 60px;
		margin: 15px auto;
	}

	.i_item {
		margin: 12px 20px;
		display: flex;

	}

	.i_item_l {
		flex: 1;
		color: #4E4E4E;
		font-size: 16px;
	
		text-align: left;
	}

	.i_item_r {
		
		flex: 1;
		text-align: right;
		color: rgba(78, 78, 78, 0.8);
		font-size: 14px;
	}
	.bg_line{
		width: 100%;
		height: 1px;
		/* background-color: #F5F5F5; */
		border:1px solid rgba(245,245,245,1);
	}
</style>
